<?php
/**
 * Created by IntelliJ IDEA.
 * User: m1573
 * Date: 2022/7/21
 * Time: 22:34
 */
    session_start();

    $username = $_SESSION["username"];
    $uid = $_SESSION["uid"];
    include ("include/header.php");
    include("include/util.inc.php");

    $table = select_history_by_uid($uid,$PDO);

    function format_table($table){
        $html = "";
        for($i = 0;$i < count($table); $i = $i + 1){
                $row = $table[$i];
                $html = $html."<tr>
                       <td>{$row["user_answer"]}</td>
                       <td>{$row["quiz_mode"]}</td>
                       <td>{$row["time_limit"]}</td>
                       <td>{$row["quiz_year"]}-{$row["quiz_month"]}-{$row["quiz_day"]}-{$row["quiz_hour"]}:{$row["quiz_min"]}</td>
                                </tr>";


        }

        $html = $html."</table>";
        return $html;
    }

    $formatted_table =  format_table($table);

?>


<?php
/**
 * Created by IntelliJ IDEA.
 * User: m1573
 * Date: 2022/7/23
 * Time: 19:18
 */
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="static/css/bootstrap.min.css" rel="stylesheet">
    <link href="static/css/all.css" rel="stylesheet">
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <link rel="stylesheet" href="static/css/bootstrap.min.css" type="text/css">
    <script type="text/javascript" src="static/js/jquery.js"></script>
    <script type="text/javascript" src="static/js/bootstrap.js"></script>

</head>

<body class="container bg">
<div class="container ">
    <div class="row mb-lg-5 col-xl-8 offset-xl-2">
        <p class="h1">History</p>
    </div>
    <div id="result" class="row col-xl-8 offset-xl-2 bg-white">
        <table class="table table-bordered text-center">
            <thead>
            <tr>
                <th scope="col">my answer</th>
                <th scope="col">category</th>
                <th scope="col">time-limit</th>
                <th scope="col">date</th>
            </tr>
            </thead>
            <tbody>
            <?=$formatted_table?>

            </tbody>
        </table>
        <nav aria-label="Page navigation example">
            <ul class="pagination justify-content-end">
                <li class="page-item disabled">
                    <a class="page-link">Previous</a>
                </li>
                <li class="page-item"><a class="page-link" href="#">1</a></li>
                <li class="page-item"><a class="page-link" href="#">2</a></li>
                <li class="page-item"><a class="page-link" href="#">3</a></li>
                <li class="page-item">
                    <a class="page-link" href="#">Next</a>
                </li>
            </ul>
        </nav>
    </div>
</div>

</body>
</html>

<script type="text/javascript" src="static/js/simpleAjax.js"></script>
<script>

</script>
